﻿$(function () {
    var vm = new Vue({
        el: "#app",
        data: {
            // 统计数据
            statistics: {
                projectSum: 0,
                totalCalls: 0,
                todaySum: 0,
                browseSum: 0,
            },
            folderData: {
                name: '',
                description: ''
            },
            folderProjects: [],
            projects: {
                data: [],
                cache: {},
                select: [],
                totalPages: 1,
                keyWord: '',
                currPage: 1,
                pageSize: 6
            },
            editing: {
                Name: false,
                Description: false
            },
            projectKeyWord: '',
            cur: 1, // 当前页
            allNum: 1, // 总页数
            pageSize: 5, // 每页条数\
            userName: '',
            showNewFolderModal: false,
            currCollapse: null,
            selectedProjects: {
                origin: [],
                current: []
            },
            foldersPage: 1,
            folderId: null
        },
        created: function () {
            this.userName = Hu.Cookies.get('HuUserName') || ''
            if (this.userName === '') {
                window.location.href = './index.html'
            } else {
                this.getHotKey() // 获取热词
                this.getQuery()
            }
        },
        mounted: function () {
            $('#addNewProjectModal').on('hide.bs.modal', () => {
                this.selectedProjects.current = [].concat(this.selectedProjects.origin)
            })
        },
        computed: {
            // 分页索引
            indexs: function () {
                var _this = this;
                var left = 1; //默认起始值是1
                var right = _this.allNum; //终止值是全部
                var arr = [];
                if (this.allNum >= 5) {
                    if (this.cur > 3 && this.cur < this.allNum - 2) {
                        left = this.cur - 2
                        right = this.cur + 2
                    } else {
                        if (this.cur <= 3) {
                            left = 1
                            right = 5
                        } else {
                            right = this.allNum
                            left = this.allNum - 4
                        }
                    }
                }
                while (left <= right) {
                    arr.push(left)
                    left++
                }
                return arr
            },
            projectsIndexs: function () {
                var projects = this.projects;
                var left = 1; //默认起始值是1
                var right = projects.totalPages; //终止值是全部
                var arr = [];
                if (projects.totalPages >= 5) {
                    if (projects.currPage > 3 && projects.currPage < projects.totalPages - 2) {
                        left = projects.currPage - 2
                        right = projects.currPage + 2
                    } else {
                        if (projects.currPage <= 3) {
                            left = 1
                            right = 5
                        } else {
                            right = projects.totalPages
                            left = projects.totalPages - 4
                        }
                    }
                }
                while (left <= right) {
                    arr.push(left)
                    left++
                }
                return arr
            }
        },
        methods: {
            initProjects() {
                this.projects = {
                    data: [],
                    cache: {},
                    totalPages: 1,
                    currPage: 1,
                    pageSize: 6
                }
                this.projectKeyWord = ''
            },
            getHotKey: function () {
                const _this = this;
                $.ajax({
                    url: "/ProjectApi/Indexdata",
                    // url: "http://39.106.120.139/ProjectApi/Indexdata",
                    data: {},
                    type: "get",
                    cache: false,
                    dataType: "json",
                    success: function (data) {
                        if (data.data.hotkeys) {
                            _this.statistics = data.data.statistics;
                        }
                    },
                    error: function (e) {
                        // view("异常！");
                        console.log('error', e);
                        // alert("异常！");
                    },
                });
            },
            getQuery() {
                let subString = window.location.search.substring(1)
                let list = subString.split('&')
                let query = {}
                for (let i = 0; i < list.length; i++) {
                    let values = list[i].split('=')
                    query[values[0]] = values[1]
                }
                this.foldersPage = query.foldersPage || 1
                this.folderId = query.id
                if (!this.folderId) {
                    window.location = './folders.html'
                } else {
                    this.getFolderData()
                    this.getProjectsData()
                }
            },
            getFolderData() {
                const _this = this
                $.ajax({
                    url: "/ProjectApi/GetFolderDetail",
                    data: {
                        id: this.folderId,
                        page: this.cur,
                        pageSize: this.pageSize,
                        userName: this.userName
                    },
                    type: "get",
                    cache: false,
                    dataType: "json",
                    success: function (data) {
                        console.log(data)
                        _this.folderData.name = data.Name
                        _this.folderData.Name = data.Name
                        _this.folderData.description = data.Description
                        _this.folderData.Description = data.Description
                        _this.folderData.create_time = data.Create_Time || '-'
                        _this.folderData.modify_time = data.Modify_Time || '-'
                        _this.folderProjects = []
                        for (let i = 0; i < data.Projects.length; i++) {
                            const project = data.Projects[i]
                            project.id = project.Project_Id
                            project.name = project.Project_Name
                            project.description = project.Project_Description
                            project.Create_Time = project.Create_Time || '-'
                            project.Modify_Time = project.Modify_Time || '-'
                            _this.folderProjects.push(project)
                        }
                        _this.allNum = data.TotalProjects / _this.pageSize + (data.TotalProjects % _this.pageSize ? 1 : 0)
                        _this.currCollapse = null
                        for (let i = 0; i < _this.folderProjects.length; i++) {
                            const data = _this.folderProjects[i]
                            _this.selectedProjects.origin.push(data)
                            _this.selectedProjects.current = [].concat(_this.selectedProjects.origin)
                        }
                    },
                    error: function (e) {
                        // view("异常！");
                        console.log('error', e);
                        // alert("异常！");
                        window.location('./folders.html')
                    },
                })
            },
            getProjectsData() {
                const _this = this
                let query = {
                    pageIndex: this.projects.currPage,
                    pageSize: this.projects.pageSize
                }
                if (this.projectKeyWord !== '') {
                    query.keyWord = this.projectKeyWord
                }
                $.ajax({
                    url: "/ProjectApi/GetList",
                    data: query,
                    type: "get",
                    cache: false,
                    dataType: "json",
                    success: function (data) {
                        console.log(data)
                        _this.projects.data = data.data.dataList
                        _this.projects.totalPages = data.data.totalPage
                        for (let i = 0; i < _this.projects.data.length; i++) {
                            const item = _this.projects.data[i]
                            _this.projects.data[i].id = item.Project_Id
                            _this.projects.data[i].name = item.Project_Name
                            _this.projects.cache[item.id] = item
                        }
                    },
                    error: function (e) {
                        // view("异常！");
                        console.log('error', e);
                        // alert("异常！");
                    },
                })
            },
            handleAddNewProjectClick() {
                $('#addNewProjectModal').modal('show')
            },
            handleAddNewProjectModalClose() {
                $('#addNewProjectModal').modal('hide')
            },
            handleAddNewProjectModalConfirm() {
                $('#addNewProjectModalConfirmButton').button('loading')
                let selected = {}
                for (let i = 0; i < this.selectedProjects.current.length; i++) {
                    const data = this.selectedProjects.current[i]
                    selected[data.id] = data
                }
                let hasDelete = false
                const deleteList = []
                for (let i = 0; i < this.selectedProjects.origin.length; i++) {
                    const data = this.selectedProjects.origin[i]
                    if (!selected[data.id]) {
                        hasDelete = true
                        deleteList.push(data.Folder_Project_Id)
                    } else {
                        delete selected[data.id]
                    }
                }
                const addList = []
                for (let item in selected) {
                    addList.push(item)
                }
                if (hasDelete) {
                    const answer = confirm('删除的项目将无法找回。你确定要继续吗？')
                    if (answer) {
                        $.ajax({
                            url: "/ProjectApi/DeleteManyFolderProjects",
                            data: {
                                Folder_Project_Id: deleteList
                            },
                            type: "post",
                            cache: false,
                            dataType: "json",
                            error: function (e) {
                                // view("异常！");
                                console.log('error', e);
                                // alert("异常！");
                            },
                        })
                    }
                }
                const _this = this
                $.ajax({
                    url: "/ProjectApi/CreateManyFolderProjects",
                    data: {
                        folderId: this.folderId,
                        projectIds: addList
                    },
                    type: "post",
                    cache: false,
                    dataType: "json",
                    success(data) {
                        if (data.code === 1) {
                            $('#addNewProjectModalConfirmButton').button('reset')
                            $('#addNewProjectModal').modal('hide')
                            _this.cur = 1
                            _this.initProjects()
                            _this.getFolderData()
                        }
                    },  
                    error: function (e) {
                        // view("异常！");
                        console.log('error', e);
                        // alert("异常！");
                    },
                })
            },
            handleProjectBoxClick(id) {
                let done = false
                for (let i = 0; i < this.selectedProjects.current.length; i++) {
                    const data = this.selectedProjects.current[i]
                    if (data.id === id) {
                        this.selectedProjects.current.splice(i, 1)
                        done = true
                        break
                    }
                }
                if (!done) {
                    this.selectedProjects.current.push(this.projects.cache[id])
                }
            },
            handleFolderDelete() {
                const answer = confirm('删除的项目将无法找回。你确定要删除吗？')
                if (answer) {
                    $.ajax({
                        url: "/ProjectApi/DeleteManyFolders",
                        data: {
                            Folder_Id: [this.folderId]
                        },
                        type: "post",
                        cache: false,
                        dataType: "json",
                        success: () => {
                            window.location = './folders.html'
                        },
                        error: function (e) {
                            // view("异常！");
                            console.log('error', e);
                            // alert("异常！");
                        },
                    })
                }
            },
            handleProjectDelete(project) {
                const answer = confirm('你确定要删除吗？')
                if (answer) {
                    $.ajax({
                        url: "/ProjectApi/DeleteManyFolderProjects",
                        data: {
                            Folder_Id: this.folderId,
                            Folder_Project_Id: [project.Folder_Project_Id]
                        },
                        type: "post",
                        cache: false,
                        dataType: "json",
                        success: () => {
                            this.getFolderData()
                            this.currCollapse = null
                        },
                        error: function (e) {
                            // view("异常！");
                            console.log('error', e);
                            // alert("异常！");
                        },
                    })
                }
            },
            pageClick() {
                console.log('page click')
            },
            btnClick(page) {

            },
            projectsPageClick() {
                console.log('page click')
            },
            projectBtnClick(page) {

            },
            projectBoxClass(id) {
                let className = 'project-box'
                for (let i = 0; i < this.selectedProjects.current.length; i++) {
                    const data = this.selectedProjects.current[i]
                    if (data.id === id) {
                        className += ' selected'
                        break
                    }
                }
                return className
            },
            handleProjectCollapseClick(id) {
                if (this.currCollapse) {
                    $('#' + this.currCollapse).collapse('hide')
                }
                if (this.currCollapse === id) {
                    this.currCollapse = null
                } else {
                    this.currCollapse = id
                    $('#' + this.currCollapse).collapse('show')
                }
            },
            handleUpdateFolderData(target) {
                if (this.folderData[target] !== this.folderData[target.toLowerCase()]) {
                    $.ajax({
                        url: "/ProjectApi/UpdateFolder",
                        data: {
                            folderId: this.folderId,
                            target: target,
                            value: this.folderData[target]
                        },
                        type: "post",
                        cache: false,
                        dataType: "json",
                        success: () => {
                            this.getFolderData()
                            this.currCollapse = null
                            this.editing[target] = false
                        },
                        error: function (e) {
                            // view("异常！");
                            console.log('error', e);
                            // alert("异常！");
                        },
                    })
                }
            }
        },
    });
});